import globalMethods from './global-methods'
import moment from 'moment'
import BasePrintButton from '@/components/BasePrintButton'
import ExcelImportButton from '@/components/ExcelImportButton'
import BaseInput from '@/components/BaseInput'
import BaseInputNumber from '@/components/BaseInputNumber'
import BaseTextarea from '@/components/BaseTextarea'

import BUpload from '@/components/BComponents/BUpload'
import BUploadVModel from '@/components/BComponents/BUploadVModel'
import BTable from '@/components/BComponents/BTable'
import ListTable from '@/components/listTable'
import BSteps from '@/components/BComponents/BSteps/BSteps'
import BStep from '@/components/BComponents/BSteps/BStep'
import BSelect from '@/components/BComponents/BSelect'
import BForms from '@/components/BComponents/BForm/BForms'
import BForm from '@/components/BComponents/BForm/BForm'
import { checkVisibleInDetail } from '@/utils/util'
import BTableUpload from '@/components/BComponents/BTableUpload'
import materialListAndDir from '@/components/materialListAndDir/materialListAndDir'

// 全局混入
export default {
  components: {
    //审批详情的按钮
    'approval-button': {
      props: {
        status: {
          type: String,
          default: ''
        },
        id: {
          type: String,
          default: '',
          required: true
        },
        text: {
          type: String,
          default: '审批详情'
        }
      },
      methods: {
        showDialog() {
          this.$bus.$emit('showApprovalDetailsDialog', this.id)
        }
      },
      render() {
        if (this.status) {
          if (this.status === 'PAST' || this.status === 'SUBMITTED' || this.status === 'REJECTED' || this.status === 'REVOKEIN' || this.status === 'REVOKE' || this.status === 'ABOLISH' || this.status === '1' || this.status === '3' || this.status === 'COMMIT'|| this.status === '2' ) {
            return <span><a onClick={this.showDialog}>{this.text}</a></span>
          }
        } else {
          return <span><a onClick={this.showDialog}>{this.text}</a></span>
        }
      }
    },
    BTable,
    ListTable,
    BSteps,
    BStep,
    BUpload,
    BSelect,
    BForm,
    BForms,
    'b-upload2': BUploadVModel,
    'b-input': BaseInput,
    'b-input-number': BaseInputNumber,
    'b-textarea': BaseTextarea,
    BasePrintButton,
    ExcelImportButton,
    BTableUpload,
    materialListAndDir
  },
  data() {
    return {
      TIMEOUT_DELAY: 400,//定时器，延迟
      SUBMIT_CONFIRM_MSG: '请确认是否要提交，提交后不可修改',//提交确认信息,
      SUCCESS_CODE: 200,
      IS_DEV: process.env.NODE_ENV !== 'production'
    }
  },
  methods: {
    //展开全局方法，合并到methods里面，任一组件直接this.$xxx调用
    ...globalMethods
  },
  filters: {
    // //将filter里面的方法添加了vue的筛选器上
    // Object.keys(filters).forEach(key => {
    //     Vue.filter(key, filters[key])
    // })
    // ...filters
    ellipsis(val,number = 30){
      if (val){
        if (val.length>number){
          return val.substr(0,30)+'...'
        }
      }
      return val
    },
    dateFormat(val, type) {
      if (!val) return
      if (typeof val === 'string') {
        val = Number(val)
      }
      if (type) type = type.toUpperCase()
      switch (type) {
        case 'Y':
          return moment(val).format('YYYY')
        case 'M':
          return moment(val).format('YYYY-MM')
        case 'D':
          return moment(val).format('YYYY-MM-DD')
        case 'm':
          return moment(val).format('YYYY-MM-DD HH:mm')
        case 'S':
          return moment(val).format('YYYY-MM-DD HH:mm:ss')
        default:
          return moment(val).format('YYYY-MM-DD HH:mm:ss')
      }
    },
    dateRangeFormat(val, type) {
      if (!val) return
      if (!val.length) return
      if (val.length !== 2) return
      if (typeof val[0] === 'string') {
        val[0] = Number(val[0])
      }
      if (typeof val[1] === 'string') {
        val[1] = Number(val[1])
      }
      if (type) type = type.toUpperCase()
      switch (type) {
        case 'Y':
          return moment(val[0]).format('YYYY') + '-' + moment(val[1]).format('YYYY')
        case 'M':
          return moment(val[0]).format('YYYY-MM') + '-' + moment(val[1]).format('YYYY-MM')
        case 'D':
          return moment(val[0]).format('YYYY-MM-DD') + '-' + moment(val[1]).format('YYYY-MM-DD')
        case 'm':
          return moment(val[0]).format('YYYY-MM-DD HH:mm') + '-' + moment(val[1]).format('YYYY-MM-DD HH:mm')
        case 'S':
          return moment(val[0]).format('YYYY-MM-DD HH:mm:ss') + '-' + moment(val[1]).format('YYYY-MM-DD HH:mm:ss')
        default:
          return moment(val[0]).format('YYYY-MM-DD HH:mm:ss') + '-' + moment(val[1]).format('YYYY-MM-DD HH:mm:ss')
      }
    },
    idCard(val) {
      if (!val) return
      if (val.length === 15) {
        return val.substr(0, 6) + '****' + val.substr(10, val.length - 1)
      }
      if (val.length === 18) {
        return val.substr(0, 6) + '********' + val.substr(14, val.length - 1)
      }
      return val
    },
    empty(val) {
      if (!val) return '无'
      return val
    }
  },
  directives: {
    //指令包装了一下，不用频繁导出导入了，判断业务详情中的组件是否需要显示
    checkVisibleInDetail: {
      inserted(el, binding, vnode) {
        if (!checkVisibleInDetail(vnode.context)) {
          el.parentNode.removeChild(el)
        }
      }
    },
    loading: {
      bind(el, binding, vnode) {
        // console.log('bind', el)
        let loading = `
                <div class="loading" style="position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    align-items: center;
    justify-content: center;
    background: white;
    z-index: 99;
    opacity: .7;
    display: ${binding.value ? 'flex' : 'none'};">
                            <span class="ant-spin-dot ant-spin-dot-spin">
                                    <i class="ant-spin-dot-item"></i>
                                    <i class="ant-spin-dot-item"></i>
                                    <i class="ant-spin-dot-item"></i>
                                    <i class="ant-spin-dot-item"></i>
                            </span>
                        </div>
                `
        el.style = 'position:relative;'
        el.insertAdjacentHTML('afterbegin', loading)
      },
      inserted(el, binding, vnode) {
        // console.log('inserted',binding.value)
      },
      update(el, binding, vnode) {
        // console.log('update', binding.value)
        let loading = el.querySelector('.loading')
        // console.log(loading)
        if (!binding.value) {
          loading.style.display = 'none'
        } else {
          loading.style.display = 'flex'
        }

      }
    }
  }
}
